<template>
  <el-dialog v-model="dialogVisible" title="视频录制" width="500" :before-close="handleClose">
    <div class="recording-video-content">
      <RecorderWrapper v-if="dialogVisible" />
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="handleClose"> 确认 </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import RecorderWrapper from './RecorderWrapper/index.vue'
const dialogVisible = defineModel({ default: false, type: Boolean }) // defineModel('count',{default: false,type: Boolean})
const mediaRecorderRef = ref(null) as any
const handleClose = () => {
  //获取MediaRecorder关闭方法，停止录制
  if (mediaRecorderRef.value) {
    mediaRecorderRef.value.closeRecording()
  }
  dialogVisible.value = false
}
</script>
<style lang="scss">
.recording-video-content {
}
</style>
